﻿//投资
var vm = new Vue({
	el: '#app',
	data: function() {
		return {
			point: {
				text: '',
				value: '',
				url: '',
				position: ''

			},
			points: []
		}
	},
	mounted: function() {
		var that = this;
		mui.init();
		that.getCameraList(); //获取摄像头位置
		mui.ready(function() {
			mui('#mainContent').scroll();
			$('.choseDate').on("tap", function() {
				var picker = new mui.PopPicker();
				picker.setData(that.points);
				picker.show(function(rs) {
					that.point.text = rs[0].text;
					that.point.value = rs[0].value;
					that.point.url = rs[0].url;
					that.point.position = rs[0].position;
					picker.dispose();
					//日期选择后的事件写在这
					$("#sp").attr('src', rs[0].url); //改变位置后修改iframe地址
					that.renderMap(); //改变位置渲染地图
				})
			});
			$('.toggle-nav').on('tap', function() {
				mui('.mui-off-canvas-wrap').offCanvas('show');
			});

		});
	},
	methods: {
		getCameraList: function(point) {
			var that = this;
			loading.show();
			$.getJSON('http://fhs.vhuomai.cn/getCameraList', {}, function(res) {
				that.points = res;
				console.log(res)
				that.point.text = res[0].text; //设置初始选中text
				that.point.value = res[0].value; //设置初始选中value
				that.point.url = res[0].url; //设置初始选中value
				that.point.position = res[0].position; //设置初始选中value
				that.renderMap(); //第一次请求数据完成后渲染地图
				loading.hide();
				console.log(that.point)
			})
		},
		renderMap: function() {
			var that = this;
			var a = that.point.position.split(',')[0];
			var b = that.point.position.split(',')[1];
			console.log(a,b)
			// 百度地图API功能
			var map = new BMap.Map("map");
			var point = new BMap.Point(a, b);
			map.centerAndZoom(point, 19);
			// 创建地址解析器实例
			// 将地址解析结果显示在地图上,并调整地图视野
			map.centerAndZoom(point, 16);
			map.addOverlay(new BMap.Marker(point));
			
  


			var pointArray = [];
            var point1 = new BMap.Point(101.714456,36.63996);
            var point2 = new BMap.Point(101.73775,36.635888);
            var point3 = new BMap.Point(101.750398,36.63251);
            var point4 = new BMap.Point(101.763612,36.621214);
            var point5 = new BMap.Point(101.773556,36.617702);
            var point6 = new BMap.Point(101.783105,36.610493);
            var point7 = new BMap.Point(101.796171,36.597365);
            var point8 = new BMap.Point(101.80612,36.592348);
            pointArray.push(point1);
            pointArray.push(point2);
            pointArray.push(point3);
            pointArray.push(point4);
            pointArray.push(point5);
            pointArray.push(point6);
            pointArray.push(point7);
            pointArray.push(point8);
            for( var i=0;i<pointArray.length;i++){
                 var myIcon = new BMap.Icon("/resources/assets/img/point.png", new BMap.Size(27,25));
                 var marker = new BMap.Marker(pointArray[i],{icon:myIcon}); // 创建标注
				 map.addOverlay(marker);
				 var txt = "";
				 if(i==0) txt = "火烧沟桥";
				 if(i==1) txt = "动物园";
				 if(i==2) txt = "植物园";
				 if(i==3) txt = "园树立交";
				 if(i==4) txt = "六一桥";
				 if(i==5) txt = "劳动路";
				 if(i==6) txt = "建国路";
				 if(i==7) txt = "湟中路";
				 var label = new BMap.Label("<div>"+txt+"</div>",{offset:new BMap.Size(20,-10)});
				 marker.setLabel(label);
 				
            }

		}
	}
})